<style scoped>
  .expand-row{
    margin-bottom: 16px;
  }
  .lyx-table-btn{
    margin-right: 5px;
    margin-bottom: 2px;
  }
  .title-size {
    font-weight: bold;
    font-size: 1rem;
  }
</style>
<template>
  <div>
      <Form label-position="right" :label-width="100" style="position: relative;" :model="formDate">
        <Row class="mb20">
          <Col span="14" class="ivu-form-item-label title-size">摇号配租意向登记表</Col>
        </Row>
        <Row class="mb20">
          <Col span="8" class="ivu-form-item-label">申请摇号批次：</Col>
          <Col span="9" offset="1" class="ivu-form-item-content">
            <Select v-model="formDate.yaoHaoId" style="width:363px">
              <Option v-for="item in ruleData.yaoHaoIdList" :value="item.yaoHaoId" :key="item.yaoHaoId">{{ item.yaoHaoName }}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="mb20">
          <Col span="13" class="ivu-form-item-label title-size">摇号申请</Col>
        </Row>
        <Row class="mb20">
          <Col span="8" class="ivu-form-item-label">摇号原因说明：</Col>
          <Col span="9" offset="1" class="ivu-form-item-content">
            <Input v-model="formDate.committeeYaoHaoReason" type="textarea" :rows="3" />
          </Col>
        </Row>
        <Row class="mb20">
          <Col span="8" class="ivu-form-item-label">该家庭申请摇号房屋类型：</Col>
          <Col span="9" offset="1" class="ivu-form-item-content">
            <Select v-model="formDate.yaoHaoType" style="width:363px">
              <Option :value=item.value v-for="item in yaoHaoArr" :key="item.value">{{item.label}}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="mb20">
          <Col span="8" class="ivu-form-item-label">社区经办人：</Col>
          <Col span="9" offset="1">
            <Input v-model="formDate.committeeYaoHaoHandler" ></Input>
          </Col>
        </Row>
        <Row class="mb20">
          <Col span="8" class="ivu-form-item-label">社区负责人：</Col>
          <Col span="9" offset="1">
            <Input v-model="formDate.committeePrincipal" ></Input>
          </Col>
        </Row>
        <Row class="mb20">
          <Col span="13" class="ivu-form-item-label">
            <Button @click="save()">提交</Button>
          </Col>
        </Row>
    </Form>
  </div>
</template>
<script>
// import { itemParamByOrderList } from '@/api/eventlist'
export default {
  name: 'Form8',
  data () {
    return {
      yaoHaoArr: [
        {
          label: '单室',
          value: 1
        },
        {
          label: '双室',
          value: 2
        },
        {
          label: '三室或三室以上',
          value: 3
        }
      ]
    }
  },
  props: {
    formDate: Object,
    ruleData: Object
  },
  mounted () {
  },
  watch: {
    // params (ret) {
    //   console.log(ret)
    // }
  },
  methods: {
    save () {
      // 判断必填字段是否为空
      if (!this.formDate.yaoHaoId) {
        this.$Notice.error({ title: '请选择申请摇号批次', desc: '' })
        return false
      } else if (!this.formDate.yaoHaoType) {
        this.$Notice.error({ title: '请选择该家庭申请摇号房屋类型', desc: '' })
        return false
      } else if (!this.formDate.committeeYaoHaoHandler) {
        this.$Notice.error({ title: '请填写社区经办人', desc: '' })
        return false
      } else if (!this.formDate.committeePrincipal) {
        this.$Notice.error({ title: '请填写社区负责人', desc: '' })
        return false
      } else {
        this.$emit('ee')
      }
    }
  }
}
</script>
